<!--奖品名单-->
<template>
  <el-drawer
    v-if="visible"
    title="中奖名单"
    size="40%"
    :visible="visible"
    @update:visible="updateVisible"
  >
    <ele-pro-table
      style="padding: 45px"
      :toolbar="false"
      ref="table"
      size="mini"
      :columns="columns"
      :datasource="datasource"
      :selection.sync="selection"
      :need-page="true"
      :hideOnSinglePage="true"
    >
      <!--IP属地插槽-->
      <template v-slot:avater="{ row }">
        <img :src="row.head" class="user-img" />
      </template>
    </ele-pro-table>
  </el-drawer>
</template>

<script>
  import {queryPrizes } from "@/api/explosiveCode/releaseActivity"
  export default {
    name: "prize-name",
    props: {
      id:Number,
      // 弹窗是否打开
      visible: Boolean,
    },
    data (){
      return {
        selection:[],
        // 表格列配置
        columns: [
          {
            prop: 'head',
            label: '头像',
            width: 95,
            align: 'center',
            slot: 'avater',
            showOverflowTooltip: true
          },
          {
            prop: 'nickname',
            label: '用户名称',
            align: 'center',
            showOverflowTooltip: true
          },
          /*{
            prop: 'avater',
            label: '等级',
            align: 'center',
            showOverflowTooltip: true
          },*/
          {
            prop: 'hitPrize',
            label: '奖品',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'drawTime',
            label: '中奖时间',
            align: 'center',
            showOverflowTooltip: true
          }
        ],
      }
    },
    created(){
      // this.getCode()
      console.log("进入组件=========",this.visible)
    },
    methods:{
      /* 表格数据源 */
      datasource({ page, limit, where, order }) {
        return queryPrizes({
          ...where,
          ...order,
          page,
          limit,
          activityId:this.id,  //活动id
          types:1,  //活动类型（1.中奖名单 2.我的奖品）
          //status:1    //'1.待激活 2.未使用  3.已使用  4.已过期 ',  暂不用传
        });
      },
      /* 刷新表格 */
      reload(where) {
        this.$refs.table.reload({ page: 1, where: where });
      },
      /* 更新 visible */
      updateVisible(value) {
        this.$emit('update:visible', value);
      },
    }
  }
</script>

<style scoped lang="less">
.user-img{
  width: 50px;
  height: 50px;
  border-radius: 50%;
}
</style>
